<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="index.css" rel="stylesheet">
</head>
<body>

<div id="app">
    <ul>
        <li :key="item.id" @click="activeIndex = index" v-for="( item,index ) in list">
            <a :class="{ active : index === activeIndex }" href="#">{{ item.name }}</a>
        </li>
    </ul>
</div>

<script src="../vue.global.js"></script>

<script>
    const {createApp, ref} = Vue;
    createApp({
        setup() {
            const activeIndex = ref(0);

            const list = ref([
                {id: 1, name: '京东秒杀'},
                {id: 2, name: '每日特价'},
                {id: 3, name: '品类秒杀'},
            ]);

            return {activeIndex, list};
        }
    }).mount('#app');
</script>


</body>
</html>